<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>

</html>

<script>
    const canvas = document.createElement("canvas");
    canvas.width = 600;
    canvas.height = 400;
    document.body.append(canvas);
    const context = canvas.getContext("2d");

    // 使用font属性修改绘制文字的大小
    context.font = '700 30px Arial';


    // 文字，坐标的起始位置是左下角开始，以前的都是左上角开始，现在文字的是左下角开始，maxWidth
    context.fillStyle = 'green';
    context.fillText('wolfcode.cn', 100, 30, 200);


    // 以文字来描边，中间是空的
    context.strokeStyle = 'white';
    context.strokeText('wolfcode.cn', 300, 60, 200);


</script>